
body{
    position: relative;
}
main{
    background: black;

    .content-video{
        // overflow: hidden;//注
        position: relative;
        min-width: 100%;//注
        height: 70%;
            // 视屏区域
        .course-video{
            width: 100%;
            height: 300px;
            overflow: hidden;

            video{
                width: 100%;
                height: 100%;
            }
        }
        // 视屏区域的文字
        .course-text{
            overflow: hidden;
            padding-left: 10px;
            position: absolute;
            bottom:0;
            left: 0;
            width: 100%;
            height: 80px;
            // 章节
            .course-num{
                font-size: 40px;
                
            }
            // 男子侧卧起做
            .course-name{
                margin: 10px 0;
            }
        }
    }
    
}





footer{
    position: relative;
    width: 100%;
    height: 90px;
    // background: chocolate;

    .last-action,.suspend,.next-move{
        width: 30%;
        height: 90px;
        line-height: 90px;
        // background: darkgray;
    }
   
    
    .fs50{
        font-size: 30px;
    }  
}
.progress-bar{
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 90px;
    width: 1%;
    background: hsla(221, 96%, 52%, 0.9)
}
// 蒙层
.meng{
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 0;

    background: hsla(221, 96%, 52%, 0.9);
    .text{
        margin: 35px auto;
        width: 340px;
        height: 50px;
        color: #fff;
    }
    // 按钮盒子
    .btnBox{
        margin-top: 40%;
        width: 340px;
        height: 20%;

        .btn{
            display: flex;
            flex-direction: column;
            justify-content: center;    
            align-items: center;

            width: 100px;
            height: 100px;
            border-radius: 50%;
            background: aqua;

            .iconbtn{
                font-size: 40px;
            }
            // .text{
            //     color: #fff;
            // }
        }
        .finish{
            background: pink;
        }
    }
    // 激励
    .stimulate-img{
        width: 340px;
        height: 120px;
        overflow: hidden;
        border-radius: 15px;
        border: 2px solid #fff;


    .min-img{
        width: 170px;
        height: 120px;
        background: darkgoldenrod;
    }
    .stimulate-text{
        width: 170px;
        height: 120px;
        .motion-text{
            width: 170px;
            height: 30px;
            color: #ccc;
        }
        .motion-name{
            width: 170px;
            height: 30px;
        }
    }
}
    
}

.show-meng{
    height: 100%;
}